<script type="text/javascript" src='{$base_dir}modules/dept_laboratory/js/AJAX_LabResult.js'></script>
<script src="{$base_dir}js/jquery.tablesorter.min.js" type="text/javascript" ></script>
<script src="{$base_dir}js/jquery.tablesorter.pager.js" type="text/javascript" ></script>
<script src='{$base_dir}js/jquery.contextmenu.r2.packed.js' type="text/javascript" ></script>

<script type="text/javascript">
    {literal}   
    $(document).ready(function () {
    	{/literal}
    	renderSelector('{$patientId}','{$selectedlabAssignmentTicketId}','{$selectedLabTicketId}');
        {literal}
        
    });
    {/literal}
</script>

<div id="LabResult">
    <div class='separator'></div>
	<div class='patientInfo' align="center">
	    <span>
	        {translate}Patient{/translate}: <span class='greenInfo' id="patientName">{$patientName}</span>
	        &nbsp;   
	        {translate}ID{/translate}: <span class='greenInfo'>{$patientCode}</span>
	        &nbsp;
	        <span class='greenInfo' id="patientDob">{translate p1=$patientDob p2=$patientAge}%s (Age %s){/translate}</span>
	        &nbsp;
	    </span>
	</div>
	
	<table cellspacing='0' cellpadding='0' style='width: 100%'>
		<tr>
			<td valign='top'>
				<div id="labResultSelection">
					<div id='labResultList' style="margin-top: 5px;">
					    <select style="width: 220px;" id="labAssignmentTicketList" >
					    </select>
					</div>
					<div id="labTicketListSelect" style="margin-top: 5px;">
						<select style="width: 220px;" size='7' id="labTicketList" >        
						</select>
					</div>
				</div>
			</td>
			<td align='right'>	
				<div id="labResultMeta" style="margin-top: 5px;">
			        <table cellspacing="0" cellpadding="0" class="grid" id="tableLabResultMeta">
					    <tbody>
					        <tr>
					            <td style="width: 150px;" class="form_label">{translate}Treatment doctor{/translate}</td>
					            <td style="width: 190px;" class="form_input"><span>{$treatmentDoctorName}</span></td>
					            <td style="width: 150px;" class="form_label">{translate}Modified{/translate}</td>
					            <td style="width: 190px;" class="form_input"><span>{$modified}</span></td>
					        </tr>
					        <tr>
					            <td class="form_label">{translate p1=1}Dr/Technician %s{/translate}</td>
					            <td class="form_input">
					                 <select id="technicianId1" tabindex="2" style="width: 100%;" >
					                 	<option value="0" selected="selected">--{translate}Select{/translate}--</option>
					                 	{html_options options=$techList selected=$technicianId1}
					                 </select>
					            </td>
					            <td class="form_label">{translate}Place{/translate}</td>
					            <td class="form_input"><span>&nbsp;</span></td>
					        </tr>
					        <tr>
					            <td class="form_label">{translate p1=2}Dr/Technician %s{/translate}</td>
					            <td class="form_input">
					                 <select id="technicianId2"   tabindex="2" style="width: 100%;" >
					                 <option value="0" selected="selected">--{translate}Select{/translate}--</option>
					                     {html_options options=$techList}
					                 </select>
					            </td>
					            <td class="form_label">{translate}Machine{/translate}</td>
					            <td class="form_input"><input id="machine" type="text"
					                tabindex="7" style="width: 97%;" /></td>
					        </tr>
					        <tr  class="last">
					            <td class="form_label">{translate}Diagnosis{/translate}</td>
					            <td class="form_input"><span></span></td>
					            <td class="form_label">{translate}Sample{/translate}</td>
					            <td class="form_input"><input type="text" tabindex="8"
					                style="width: 97%;" /></td>
					        </tr>
					    </tbody>
					</table>
				</div>
			</td>
		</tr>
	</table>

	<div class="lab_grid" style='margin-top: 10px;'>
	         <div class="h_div">
	              <table cellspacing="0" cellpadding="0">
	                   <thead>
	                      <tr>
	                          <th style="width: 200px;">{translate}Element{/translate}</th>
	                          <th style="width: 100px;">{translate}Result{/translate}</th>
	                          <th style="width: 65px;">{translate}Unit{/translate}</th>
	                          <th style="width: 120px;">{translate}Normal(M){/translate}</th>
	                          <th style="width: 120px;">{translate}Normal(F){/translate}</th>
	                       </tr>
	                    </thead>
	               </table>
	         </div>
	         <div id="labResultContent">
	         	<div style="height: 250px;" class="b_div"></div>
	         </div>     
    </div>
    
    <div style="margin-top: 10px; text-align: right;">
                <span id='statusMessage'></span>
                <button style="margin-left: 10px;" onclick="saveLabResult(true);">{translate}Save & Print{/translate}</button>
                <button style="margin-left: 10px;" onclick="saveLabResult(false);">{translate}Save{/translate}</button>                
    </div>
        
</div>
 
<div id="labResultLoaderDiv" style="display: none; position: fixed; top: 0px; left: 0px; height: 100%; width: 100%; z-index: 1000">
    <div style="overflow: hidden; background-color: #000; position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; opacity: 0.2;">
    </div>
    <div style='padding: 6px 0px 0px 6px; position: absolute; top: 50%; left: 50%; width: 40px; height: 40px; background: #F5F5F5; border: 3px solid #CCC; margin-left: -20px; margin-top: -30px;'>
        <img src="{$base_uri}/images/ajax-loader.gif"/>
    </div>
</div>